<template>
  <div>
    <common-head></common-head>
    <div class="container">
      <van-contact-card
        :type="cardType"
        :name="nowOrder.address.name"
        :tel="nowOrder.address.tel"
        @click="chooseContact"
      />
      <van-card
        v-for = 'item in nowOrder.items'
        :key = 'item.id'
        :num="item.num"
        :price="item.minPrice.toFixed(2)"
        :desc="item.characteristic"
        :title="item.name"
        :thumb="item.pic"
      />
      <van-submit-bar :price="nowOrder.nonPayment*100" button-text="提交订单" @submit="onSubmit" />
    </div>
  </div>
</template>

<script>
import CommonHead from '@components/CommonHead'
import { mapState } from 'vuex'
export default {
  data () {
    return {
    }
  },
  // mounted () {
  //   console.log(this.nowOrder.items)
  // },
  computed: {
    // 如果存在联系人地址，就'edit'，否则'add'
    cardType () {
      if (this.nowOrder.address.name) {
        return 'edit'
      } else {
        return 'add'
      }
    },
    ...mapState({
      nowOrder: (state) => state.order.nowOrder
    })
  },
  methods: {
    // 去联系人列表选择联系人
    chooseContact () {
      if (this.cardType === 'add') {
        this.$router.push('/addAddress')
      } else if (this.cardType === 'edit') {
        this.$router.push('/addressList')
      }
    },
    onSubmit () {}
  },
  components: {
    CommonHead
  }
}
</script>

<style lang="scss" scoped>

</style>
